<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2024/12/10
  Time: 下午6:51
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="js/vue-2.6.10.js"></script>
    <script src="js/axios.min.js"></script>
    <style>
        #app{
            text-align: center;
            display: grid;
            place-items: center;
        }
        #app table{
            text-align: center;
            border: 1px solid black;
            border-collapse: collapse;
        }
        #app table td{
            border: 1px solid black;
        }
    </style>

</head>
<body>
<div id="app">
    <h1>我的订单</h1>
    <table>
        <thead>
        <tr>
            <td>编号</td>
            <td>订单编号</td>
            <td>姓名</td>
            <td>是否出货</td>
            <td>订单时间</td>
<%--            <td>操作</td>--%>
        </tr>
        </thead>
        <tbody>
        <tr v-for="item in navlist" :key="item.id">
            <td>{{index+1}</td>
            <td>{{item.productId}}</td>
            <td>{{item.customerName}}</td>
            <td>{{item.isDelivery}}</td>
            <td>{{item.orderTime}}</td>
        </tr>
        </tbody>
    </table>
</div>
<script>
    const app=new Vue({
        el:'#app',
        data:{
            navlist:[
                {id:1, productId:'20230405099',customerName:'yw',isDelivery:'是',orderTime:'2024-12-17 12:12:23'},
                {id:2, productId:'20230405099',customerName:'yw',isDelivery:'是',orderTime:'2024-12-17 12:12:23'},
                {id:3, productId:'20230405099',customerName:'yw',isDelivery:'是',orderTime:'2024-12-17 12:12:23'},
                {id:4, productId:'20230405099',customerName:'yw',isDelivery:'是',orderTime:'2024-12-17 12:12:23'},
                {id:5, productId:'20230405099',customerName:'yw',isDelivery:'是',orderTime:'2024-12-17 12:12:23'},
            ]
        },
        created(){
            axios({
                url:'getOrderInfo.do',
            }).then(re=>{
                re.data.forEach(item=>{
                    item.isDelivery='是'
                })
                console.log(re)
                this.navlist=re.data
            })
        }
    })
</script>
</body>
</html>
